<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <title>修改提现密码</title>
        <link rel="stylesheet" href="<c:url value="/static/wx/css/style.css"/>" />
        <script type="text/javascript" src="<c:url value="/static/wx/js/lib/rem.js"/>"></script>
	</head>
    <body class="befeff4">
            <div id="wrap">
                <!--输入支付密码-->
                <div class="pwd-box befeff4">

                    <div class="wrap_passPwd">
                        <div class="tc">
                            请输入支付密码，以验证身份
                        </div>
                        <div class="relative pwd-common" data="1">
                            <input type="tel" maxlength="6" class="pwd-input" id="pwd-input-pass" onkeyup="value=value.replace(/\D/g,'')">
                            <div class="fake-box pwd-input-pass">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                            </div>
                        </div>

                        <div class="tr">
                            <a class="tr f14" style="color: #477AAC;padding-right:10px;" href="<c:url value="/wx/toSetPassword.do"/>?userId=${userId}">忘记原密码？</a>
                        </div>
                    </div>

                    <div class="wrap_onePwd">
                        <div class="tc">
                            请设置支付密码，用于支付验证
                        </div>
                        <div class="relative pwd-common" data="1">
                            <input type="tel" maxlength="6" class="pwd-input" id="pwd-input-one" onkeyup="value=value.replace(/\D/g,'')">
                            <div class="fake-box pwd-input-one">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                            </div>
                        </div>
                    </div>

                    <div class="wrap_twoPwd">
                        <div class="tc">
                            请再次填写以确认
                        </div>
                        <div class="relative pwd-common" data="2">
                            <input type="tel" maxlength="6" class="pwd-input" id="pwd-input-two" onkeyup="value=value.replace(/\D/g,'')">
                            <div class="fake-box pwd-input-two">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                                <input type="password" readonly="">
                            </div>
                        </div>
                        <div class="wrap_btn mt65">
                            <a href="javascript:void(0)" class="button" id="submit_btn">完成</a>
                        </div>
                    </div>
                </div>

                <!--设置成功提示弹窗开始-->
                <div class="msg-succ">
                    <img src="<c:url value="/static/wx/img/succ_icon.png"/>" /> <span class="f20">密码设置成功</span>
                </div>
                <!--设置成功提示弹窗结束-->
            </div>
            <input type="hidden" id="userId" value="${userId}" />
            <script type="text/javascript" src="<c:url value="/static/wx/js/lib/jquery-3.3.1.min.js"/>"></script>
            <script type="text/javascript">
                var userId = $("#userId").val();
                $('.pwd-box').show();
                $(".wrap_onePwd").hide();
                var $inputPass = $(".pwd-input-pass input");
                var $inputOne = $(".pwd-input-one input");
                var $inputTwo = $(".pwd-input-two input");
                var pwdPass, pwdPassLen, pwdOne, pwdOneLen, pwdTwo, pwdTwoLen;

                $("#pwd-input-pass").on("keyup", function() {
                      pwdPass = $(this).val().trim();
                      pwdPassLen = pwdPass.length;

                      for(var i = 0; i < pwdPassLen; i++) {
                          $inputPass.eq("" + i + "").val(pwdPass[i]);
                      }

                      $inputPass.each(function() {
                          var index = $(this).index();
                          if(index >= pwdPassLen) {
                              $(this).val("");
                          }
                      });

                      if(pwdPassLen == 6) {
                          $.ajax({
                              type: "POST",
                              url: "<c:url value="/wx/checkPayPad.do"/>",
                              async: true,
                              data: {
                                  userId: userId,//28444765309003157247057352550
                                  pwdPass : pwdPass//旧密码
                              },
                              cache: true, 
                              async:false, 
                              dataType: "json",
                              success: function(data) {
                                  if(data.msg == "1") {
                                      $(".wrap_passPwd").hide();
                                      $(".wrap_onePwd").show();
                                  }else {
                                	  alert("密码错误");
                                  }
                              }
                          });
                      }
                  });

                  //密码1
                  $("#pwd-input-one").on("keyup", function() {
                      pwdOne = $(this).val().trim();
                      pwdOneLen = pwdOne.length;

                      console.log("pwdOneLen", pwdOneLen);

                      for(var i = 0; i < pwdOneLen; i++) {
                          $inputOne.eq("" + i + "").val(pwdOne[i]);
                      }

                      $inputOne.each(function() {
                          var index = $(this).index();
                          if(index >= pwdOneLen) {
                              $(this).val("");
                          }
                      });

                      if(pwdOneLen == 6) {
                          $(".wrap_onePwd").hide();
                          $(".wrap_twoPwd").show();
                      }
                  });
                  //密码2
                  $("#pwd-input-two").on("keyup", function() {
                      pwdTwo = $(this).val().trim();
                      pwdTwoLen = pwdTwo.length;

                      console.log("pwdTwo", pwdTwo);

                      for(var i = 0; i < pwdTwoLen; i++) {
                          $inputTwo.eq("" + i + "").val(pwdTwo[i]);
                      }

                      $inputTwo.each(function() {
                          var index = $(this).index();
                          if(index >= pwdTwoLen) {
                              $(this).val("");
                          }
                      });
                  });

                  $("#submit_btn").on("click", function() {
                      if(!pwdTwo) {
                          alert("密码不能为空");
                          return;
                      } else if(pwdTwoLen < 6 || pwdTwoLen != pwdOneLen) {
                          alert("密码长度有误");
                          return;
                      } else if(pwdOne != pwdTwo) {
                          alert("2次密码输入不一致");
                          return;
                      } else {
                          var f = arguments.callee,
                          self = this;
                          $(self).unbind('click', f);
                          $.ajax({
                              type: "POST",
                              url: "<c:url value="/wx/setPay.do"/>",
                              async: true,
                              data: {
                                  userId: userId,//28444765309003157247057352550
                                  password: pwdOne,//旧密码
                              },
                              cache: true, 
                              async:false, 
                              dataType: "json",
                              success: function(data) {
                                  if(data.msg == "1") {
                                      $(".msg-succ").show();
                                      //返回设置页面
                                      setTimeout(go(userId), 3000)
                                  } else {
                                      $(self).click(f);
                                  }
                              }
                          });
                      }
                  })
                  
                  function go(userId){
                      //设置密码页面
                      window.location.href = "<c:url value="/wx/toSecurity.do"/>?id="+userId;
                  }
            </script>
        </body>
    
</html>